<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>创建css</title>
    <!--外部css引用-->
    <link rel="stylesheet" href="./css/c1.css">
    <style>
        #p1{
            font-size: 40px;
            color: greenyellow;
        }
    </style>
</head>
<body>
    <h1>创建css</h1>
    <ol><li>外部样式</li>
    <li>内部样式</li>
<li>内联样式</li></ol>
<p>

    优先级：由高到低
    内联样式>内部样式>外部样式
</p>
<hr>
<!--内联样式：style为元素的属性，内容为css语法-->
<p style="color: red;font-size: 50px;">你好，世界</p>
<!--内部样式-->
<p id="p1">hello world</p>
<!--外部样式-->
<div>楚门的世界</div>
<!--使用外部样式 修饰如下元素-->
<p id="p2" style="color: aqua;">红色的鲜花</p>
<span class="c2">紫色的妖姬</span>
<p ></p>
</body>
</html>